# useCustomLogic

You can build your own custom hook to perform unique logic that
is not currently exported by the library.

The hooks exported by the library essentially just return HTML
props (`onClick{:.keyword}`, `aria-describedby{:.keyword}`, etc.)
inside a prop getter key, which get merged. You can do the same
thing.

> As the library is fully tree-shakeable, commonly used features
> will likely be included in the future to avoid you needing to
> write custom interaction hooks.

```js
const useCustomLogic = (
  context: FloatingContext
): ElementProps => {
  // Note: all 3 of these properties are optional.
  return {
    reference: {
      // React.HTMLProps
      onClick() {
        console.log('clicked!');
      },
    },
    floating: {
      // React.HTMLProps
    },
    item: {
      // React.HTMLProps
    },
  };
};
```

If you have ideas for new hooks or functionality, don't hesitate
to open a new issue or discussion on the
[GitHub repo](https://github.com/floating-ui/floating-ui)!
